<template>
    <h2>借款项目列表</h2>
    <table class="table table-bordered" border="1">
        <thead style="background-color:aqua">
           <tr>
               <th>借款款项ID</th>
               <th>借款款项名称</th>
               <th>借款最高金额</th>
               <th>借款最高年限</th>
               <th>预计月还款金额</th>
               <th>利息值</th>
               <th>操作</th>
           </tr>
        </thead>
        <tbody>
            <tr v-for="item in info" >
                <td>{{item.B_id}}</td>
                <td>{{item.B_Name}}</td>
                <td>{{item.BM_Money}}</td>
                <td>{{item.B_Year}}</td>
                <td>{{(item.BM_Money/item.B_Year/12).toFixed(2)}}CNY</td>
                <td>{{item.BMI_Interest}}</td>
                <td><a href="#" @click="SaveData(item.B_id)">用户借款还款明细</a></td>
            </tr>
        </tbody>
    </table>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue';
import axios  from 'axios';
import {useRouter} from 'vue-router';

const router = useRouter();
const info = ref([{
 B_id:0,
 B_Name:"",
 BM_Info:"",
 BM_Money:0,
 B_Year:0,
 BMI_Interest:0
}])

onMounted(()=>{
    LoadData();
})

const LoadData =()=>{
     axios({
         url:"https://localhost:44337/api/Borrow/ShowBorrowMoneyInfo",
         method:"get"
     }).then(res=>{
         console.log(res.data);
         info.value = res.data;
     }).catch(err=>{
         console.log(err);
     })
}

const SaveData=(BMid:number)=>{
     router.push({
        name:"ShowUserBorrowRepayInfo",
        params:{
            BMid:BMid,
        }
     })
}
</script>
